<!--
 * @Author       : jiangxiaoying
 * @Date         : 2021-01-04 10:18:13
 * @LastEditors  : jiangxiaoying
 * @LastEditTime : 2021-01-04 11:22:53
 * @FilePath     : \cloud-components\docs\pages\components\cloud-input-number\example2.vue
-->
<template>
  <div>
    <CloudInputNumber :min="1" :max="10" :disabled="disabled" :default-value="3"></CloudInputNumber>
    <div style="margin-top: 20px">
      <CloudButton type="primary" @click="toggle"> Toggle disabled </CloudButton>
    </div>
  </div>
</template>

<script>
  export default {
    title: '2.不可用 ',
    subTitle: '点击按钮切换可用状态。',
    data () {
      return {
        disabled: true,
      }
    },
    methods: {
      toggle () {
        this.disabled = !this.disabled;
      },
    }
  }
</script>

<style lang="scss">
  .tag-box {
    display: flex;
  }
  .tag-item {
    padding-right: 10px;
  }
</style>